<template>
	<view>
		<!-- 顶部导航切换 -->
		<view class="flex justify-center my-3">
			<view class="flex justify-between" style="width: 70%;">
				<view @click="Select(i)" v-for="(item,i) in NavData" :key="i" :class="(i==active?'border-bottom-'+color:'borderss')">
					<text>{{item.title}}</text>
				</view>
			</view>
		</view>
		<!-- 个人信息 -->
		<view v-if="hiding" class="bg-white p-4 flex flex-column justify-between font-sm" style="height: 500rpx;">
			<view class="flex justify-between align-center">
				<text>登陆账号</text>
				<text>{{UserInfo.userAccount}}</text>
			</view>
			<view class="flex justify-between align-center">
				<text>姓名</text>
				<text>{{UserInfo.userName}}</text>
			</view>
			<view class="flex justify-between align-center">
				<text>手机</text>
				<view class="flex align-center">
					<text>{{UserInfo.userPhone}}</text>
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<text>签章密码</text>
				<view class="flex align-center">
					<text>{{UserInfo.userSignaturePassword}}</text>
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<text>登录密码</text>
				<view class="flex align-center">
					<text>{{UserInfo.userPassword}}</text>
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<text>认证状态</text>
				<view class="flex align-center">
					<text>{{UserInfo.userRealnameStatus=='0'?'审核个体':UserInfo.userRealnameStatus=='1'?'审核企业':UserInfo.userRealnameStatus=='2'?'通过个体':UserInfo.userRealnameStatus=='3'?'通过企业':UserInfo.userRealnameStatus=='4'?'未通过个体':UserInfo.userRealnameStatus=='5'?'未通过企业':'无'}}</text>
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
			<view @click="goBelive()" class="flex justify-between align-center">
				<text>信用指数</text>
				<view class="flex align-center">
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
			<view class="flex justify-between align-center">
				<text>注销账号</text>
				<view class="flex align-center">
					<uni-icons color="#bbb" type="right"></uni-icons>
				</view>
			</view>
		</view>
	    <view v-else class="p-2">
	    	<view class="flex p-2 bor align-center justify-between">
	    		<view class="flex">
	    			<image style="width: 80rpx;" src="/static/user.png" mode="widthFix"></image>
	    			<view class="ml-3">
	    				<text>{{UserInfo.userName}}</text>
	    				<view class="flex justify-between w-100">
	    					<view v-for="(item,i) in 3" :key="i" class="font-small mt-2 mr-2" style="border: 2rpx solid #0f0;color:#0f0;border-radius: 10rpx;">
	    						个人商家
	    					</view>
	    				</view>
	    			</view>
	    		</view>
				<uni-icons color="#bbb" type="right"></uni-icons>
	    	</view>
	    </view>
	</view>
</template>

<script>
	const app = getApp()
	export default {
		data() {
			return {
				color: uni.getStorageSync('ThemeColors') ? uni.getStorageSync('ThemeColors') : 'green',
				active:0,
				NavData:[
					{
						title:'个人信息'
					},
					{
						title:'商家列表'
					},
				],
				UserInfo:{
					userAccount:'',
					userName:'',
					userPhone:'',
					userSignaturePassword:'',
					userPassword:'',
					userRealnameStatus:'',
				},
				hiding:true,
			};
		},
		methods:{
			Select(i){
				this.active = i
				if(i==0){
					this.hiding = true
				}else{
					this.hiding = false
				}
			},
			goBelive(){
				uni.navigateTo({
					url:'/pages/My/Belive'
				})
			}
		},
		onLoad() {
			this.UserInfo.userName = uni.getStorageSync('username')
			this.UserInfo.userPhone = uni.getStorageSync('use')
			this.UserInfo.userAccount = uni.getStorageSync('use')
			this.UserInfo.userRealnameStatus = uni.getStorageSync('authenticationType')
		}
	}
</script>

<style lang="scss">
.borders{
	color: #fc7c08;
	border-bottom: 4rpx solid #fc7c08;
	transition: all 0.5s;
}
.borderss{
	border-bottom: 4rpx solid transparent;
}
</style>
